import { useUserStore } from "@/store/modules/user";

// 全局自定义指令
export const directivePlugin = {
    install(app: any) {
        console.log("intsall执行了");

        // 注册自动获取输入框焦点的全局指令
        app.directive('input-focus', {
            // el：指令绑定的元素；binding：包含指令后携带的数据，是个对象
            mounted(el: HTMLElement) {
                // 在组件|DOM挂载完毕后，执行一次，自动获取焦点
                if (el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement) {
                    el.focus();
                } else {
                    // 处理可能嵌套的情况
                    const input = el.querySelector('input, textarea');
                    if (input) {
                        (input as HTMLInputElement).focus();
                    }
                }
            }
        })

        // 注册判断按钮权限的全局指令
        app.directive('auth-buttons', {
            // el：指令绑定的元素；binding：包含指令后携带的数据，是个对象
            mounted(el: HTMLElement, binding: any) {
                // 在组件|DOM挂载完毕后，执行一次
                // 获取用户仓库对象
                const userStore = useUserStore();
                // 判断当前按钮的权限字符是否在返回按钮数组中
                console.log(binding)
                if (!userStore.authButtons.includes(binding.value)) {
                    // 指令后的数值包含在按钮数组中
                    console.log(el);
                    if (el instanceof HTMLButtonElement) {
                        // 指令绑定的元素是 button按钮，删除该元素
                        el.parentNode?.removeChild(el);
                    }
                }
            }
        })
    }
}